<div ng-init="init();" class="kmi-layout-content A01-content">
    <div class="kmi-header-row">
        <div class="kmi-side-btn left" ng-click="back();">
            <i class="material-icons">&#xE408;</i>
            <div class="kmi-can-click"></div>
        </div>
        <div class="brand-title">
            <div class="custom" ng-if="companyName">
                <div class="title" ng-bind="companyName"></div>
                <img src="" alt="" class="brand">
                <div class="gap"></div>
            </div>
            <div class="digiwin">
                <img src="image/smes_v340/logo_ch.png" alt="">
                <img src="image/smes_v340/logo_en.png" alt="">
            </div>
        </div>
        <div class="header-title" ng-bind="'A01.title' | translate"></div>
        <div class="header-logo"></div>
    </div>
    <div class="kmi-layout-main-content">
        <div class="kmi-layout-page">
            <div>
                <div class="kmi-text-fields">
                    <label class="label" ng-bind="'A01.areaNo' | translate"></label>
                    <input ng-model="areaName" readonly="readonly" ng-click="loadAreaList();"></input>
                    <div class="tip"><i class="material-icons">&#xE5CF;</i></div>
                </div>
            </div>
            <div class="kmi-list machine-list">
                <div class="kmi-list__header">
                    <div class="kmi-list__column width-fixed" style="flex:0 0 40px">
                        <button class="mdl-button mdl-js-button mdl-button--icon" ng-click="selectAll();">
                            <img ng-if="!isSelectAll" src="image/icons/check0.png"></img>
                            <img ng-if="isSelectAll"  src="image/icons/check1.png"></img>
                        </button>
                    </div>
                    <!-- 注意此處篩選是machine_display，排序是machine_no -->
                    <div class="kmi-list__column head-controls" style="flex:1;">
                        <div class="filter" ng-show="filterSH.machine_no">
                            <input ng-model="filter.machine_display">
                            <i class="material-icons clear" style="position: absolute;top: 2px;right: 4px;"
                               ng-click="filterSH.machine_no = false; filter.machine_display = '';">clear</i>
                        </div>
                        <div class="order" ng-hide="filterSH.machine_no">
                            <i class="material-icons search" style="z-index:1;" ng-click="filterSH.machine_no = true">search</i>
                            <label ng-bind="'A01.list.column1' | translate"></label>
                            <i class="material-icons" ng-show="order_by_mode.name == 'machine_no'">{{order_by_mode.sort?'&#xE5DB;':'&#xE5D8;'}}</i>
                            <div class="kmi-can-click" ng-click="orderbychange('machine_no')"></div>
                        </div>
                    </div>
                </div>
                <div class="kmi-list__row-content">
                <div class="kmi-list__row" ng-repeat="item in getPages(machineList, PageConfig, filter) track by $index">
                    <div class="kmi-list__column" style="flex:0 0 40px;">
                        <button class="mdl-button mdl-js-button mdl-button--icon" ng-hide="item.dispatch_mode=='-'">
                            <img ng-show="item.dispatch_mode=='0'" src="image/icons/check0.png"></img>
                            <img ng-show="item.dispatch_mode=='1'" src="image/icons/check1.png"></img>
                            <img ng-show="item.dispatch_mode=='2'" src="image/icons/check1.png"></img>
                        </button>
                    </div>
                    <div class="kmi-list__column" style="flex:1;" ng-bind="item.machine_name + ' ('+item.machine_no+')'"></div>
                    <div class="kmi-can-click" ng-click="itemCheck($index,item);" ng-if="item.dispatch_mode != undefined && item.dispatch_mode != '2' && item.dispatch_mode != '-'"></div>
                </div>
                </div>
            </div>
        </div>
        <div class="kmi-layout-footer">
            <button class="mdl-button mdl-js-button mdl-button--fab mdl-shadow--custom mdl-button--custom1"
            ng-click="confirm();">
              <i class="material-icons">done</i>
            </button>
        </div>
    </div>
</div>
